<template>
	<div class="geshou">
		<header>
			<van-nav-bar
			  left-arrow
			  @click-left="onClickLeft"
			  style="background: #f7f7f7;"
			></van-nav-bar>
		</header>
		
		<section style="padding: 44px 30px 0 ;color: #A8A8A8;">
			<h1>注册</h1>
			<van-cell-group style="margin: 47px 0 11px;">
			  <van-field v-model="value" placeholder="请输入账号" label="+86" style="border: #A8A8A8 1px solid;border-radius: 70px;"></van-field>
			</van-cell-group>
			
			<van-cell-group style="margin: 13px 0;">
				  <van-field
				    v-model="sms"
				    center
				    clearable
				    placeholder="请输入短信验证码"
				    style="border: #A8A8A8 1px solid;border-radius: 70px;"
				  >
				    <van-button slot="button" size="small" type="primary">发送验证码</van-button>
				  </van-field>
				</van-cell-group>
				
			<van-cell-group style="margin-bottom: 30px;">
			  <van-field v-model="value" placeholder="请输入密码" style="border: #A8A8A8 1px solid;border-radius: 70px;"></van-field>
			</van-cell-group>
			
			<van-radio checked-color="#07c160" style="margin-bottom: 50px;">我已阅读并同意</van-radio>
			
			<van-button round style="padding: 0 70px;margin-left: 70px;">注册</van-button>
		</section>
		
		
	</div>
</template>

<script>
	import { NavBar ,NoticeBar,Cell, CellGroup,Field,Button, Radio} from 'vant'
	
	export default{
		name:'Register',
		components:{
			[NavBar.name]:NavBar,
			[NoticeBar.name]:NoticeBar,
			[Cell.name]:Cell,
			[CellGroup.name]:CellGroup,
			[Field.name]:Field,
			[Button.name]:Button,
			[Radio.name]: Radio
		},
		data(){
			return{
				src:''
			}
		},
		methods:{
			onClickLeft(){
				this.$router.go(-1);
			},
		},
	}
</script>

<style>
	.geshou{
		height: 100vh;
	display: flex;
	flex-direction: column;
	
	}
	section{
	flex: 1;
	overflow: auto;

}
</style>